<template>
	<view class="content">
		<view class="base-btn-fixed unify-background-color" :class="[fixed? 'unify-fixed': '']" @tap="$emit('click')">
			<view class="base-btn-t" :class="[fixed? 'unify-absolute': '', isWeight? 'unify-weight': '', 'bg-' + themeColor.name]" :style="{'width': !fixed? '100%': '', 'border-color': borderColor, 'background': backgroundColor, 'color': color, 'border-radius': borderRadius}">{{title}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			title: {
				type: String,
				default: ''
			},
			backgroundColor: {
				type: String,
				default: ''
			},
			borderColor: {
				type: String,
				default: ''
			},
			color: {
				type: String,
				default: ''
			},
			fixed: {
				type: Boolean,
				default: true
			},
			isWeight: {
				type: Boolean,
				default: false
			},
			borderRadius: {
				type: String,
				default: '30px'
			}
		},
		data() {
			return {
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	// 悬浮
	.base-btn-fixed {
		width: 100%;
		height: 50px;
		z-index: 99;
		left: 0;
		bottom: var(--window-bottom);
		
		.base-btn-t {
			width: 92%;
			left: 0;
			right: 0;
			top: 0;
			bottom: 0;
			margin: auto;
			height: 40px;
			line-height: 40px;
			border: 2rpx solid $uni-border-base-color;
			text-align: center;
		}
	}
</style>
